import React,{Component} from "react";
import {BrowserRouter as Router, Route, Link} from 'react-router-dom';


import "../css/home_Sections1.css";
import {connect} from "react-redux";
import $ from "jquery";

class Sections2 extends React.Component {
	componentDidMount() {
		var that = this;
		// http://localhost:8080/home_section2?page=1&count=3
	    $.get('http://localhost:8080/home_section2', function(res) {
	    	// console.log(JSON.parse(res).data.films);
	    	var data = JSON.parse(res).data.films;
	      	that.props.getSection1Data2(data);
	    })
  	}
	render(){
		return(
			<div>
				<ul className="section">
					{
						this.props.getMainData2.map(function(item,index){
							var date = new Date(item.premiereAt);
							var month = date.getMonth()+1;
							var day = date.getDate();
							return (
								<li key={index}>
									<Link to={"/detail/"+item.id}>
										<img src={item.cover.origin} alt="网络异常，请刷新后再试"/>
										<div className="jieshao">
											<div className="film_name">
												<p>{item.name}</p>
											</div>
											<span className="play_time">{month}月{day}号上映</span>
										</div>
									</Link>
								</li>	
							)
						})
					}
					<Link to="/film/will_playing" className="load_more">更多即将上映电影</Link>
				</ul>
			</div>
		)
	}
}

var Section2 = connect(
	function(state,ownprops){
		return {
			getMainData2:state.getMainData2
		}
	},
	function(dispatch,ownprops){
		return {
			getSection1Data2:function(data){
				dispatch({
					type:"GETSECTION2",
					data:data
				})
			}
		}
	}
)(Sections2);

export default Section2;